<!DOCTYPE html>

<html>
<head>
{{template "common/head.html" .}}
    <style type="text/css">
        html, body {
            background-image: url("/static/img/login-bg.jpeg");
        }

        .login {
            margin-top: 100px;
            text-align: center;
        }
        .layui-card{
            border-radius: 10px;
        }
        .layui-card-body{
            margin-top: 10px;
        }
        .login-btn{
            border-radius: 0px 0px 10px 10px;
        }
    </style>

</head>

<body>
<div id="app">

    <div class="layui-container">
        <div class="layui-row">
            <div class="login layui-col-xs12 layui-col-sm6 layui-col-sm-offset3 layui-col-md4 layui-col-md-offset4">

                <div class="layui-card">
                    <div class="layui-card-header"><h2>登录-LPhoto</h2></div>
                    <div class="layui-card-body layui-form layui-form-pane">
                        <div class="layui-form-item">
                            <label class="layui-form-label">用户名</label>
                            <div class="layui-input-block">
                                <input type="text" v-model="username" placeholder="请输入用户名" @keyup.enter="login" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-form-item">
                            <label class="layui-form-label">密&nbsp;&nbsp;&nbsp;&nbsp;码</label>
                            <div class="layui-input-block">
                                <input type="password" v-model="password" placeholder="请输入密码" @keyup.enter="login" class="layui-input">
                            </div>
                        </div>
                    </div>
                    <button class="layui-btn layui-btn-fluid login-btn" @click="login">登录</button>
                </div>

            </div>
        </div>

    </div>
</div>
</body>

<script>
    new Vue({
        el: '#app',
        data: {
            username: "",
            password: ""
        },
        methods: {
            login() {
                if (isNull(this.username)) {
                    showMsg("请输入用户名");
                    return;
                }
                if (isNull(this.password)) {
                    showMsg("请输入密码");
                    return;
                }
                axios.post("/admin/login/doLogin", {
                    'username': this.username,
                    'password': this.password
                })
                .then(function (response) {
                    if (response.data.code === 1) {
                        location.href = "/admin"
                    } else {
                        showMsg(response.data.info)
                    }
                })
            }
        }
    })
</script>
</html>
